//----------------------------常量------------------------
const bd = document.querySelector(".bd");
const bdSet = document.querySelector(".bd-set");
const fontcolor = document.querySelector(".fontcolor");
const a = document.querySelectorAll('a');
const countDown = document.querySelector('.coundDown');
const timedown = document.querySelector('.time-down');
const timebutton = document.querySelector(".timebutton");
const h = document.querySelector(".h");
const s = document.querySelector(".s");
const inputs = document.querySelector('.inputs');
const quren = document.querySelector('.quren');
const stopBox = document.querySelector(".stop");
const timerMeter = document.querySelector('.time-meter');
const timerBox = document.querySelector('.js-box');
const jxiao = document.querySelector(".j-xiao");
const jsen = document.querySelector(".j-seconds");
const jminutes = document.querySelector('.j-minutes');
const start = document.querySelector(".start");
let timer;//计时器
let timerfun;//计时器
let isjudge = true;
//----------------------------时钟区域--------------------------
setTime()
function setTime() {
    const now = new Date();
    let year = now.getFullYear(),
        month = now.getMonth() + 1,
        day = now.getDate(),
        hour = now.getHours(),
        minutes = now.getMinutes(),
        seconds = now.getSeconds();
    hour = hour < 10 ? "0" + hour : hour;
    minutes = minutes < 10 ? "0" + minutes : minutes;
    h.innerText = hour;
    s.innerText = minutes;
    let data = { year, month, day, hour, minutes, seconds };
    return data
}
const data = setTime();
setInterval(setTime, 30000);
//------------------------换色--------------------------------
(function (nums) {
    let bj = document.querySelector(".bj"),
        zt = document.querySelector(".zt"),
        lis, liscopy;
    for (let i = 0; i < nums; i++) {
        lis = document.createElement("li");
        lis.setAttribute("class", "ztbox");
        zt.appendChild(lis)
        liscopy = lis.cloneNode(true);
        liscopy.setAttribute("class", "bjbox")
        bj.appendChild(liscopy);
    }
})(20)
function setNone() {
    fontcolor.style.display = "none";//变色盒子隐藏
    timedown.style.display = "none";//倒计时盒子隐藏
    timerBox.style.display = 'none';//计时盒子隐藏
    clearInterval(timerfun);
    clearInterval(timer);
}
bd.addEventListener('click', function tt(event) {
    var event = event.target;
    switch (event.className) {
        case "skim":
            setNone();
            fontcolor.style.display = "block";
            break;
        case "ztbox":
            var footcolor = document.defaultView.getComputedStyle(event, null).backgroundColor;
            document.body.style.color = footcolor;
            for (let key of a) {
                key.style.color = footcolor;
            }
            break;
        case "bjbox":
            var bgcolor = document.defaultView.getComputedStyle(event, null).backgroundColor;
            document.body.style.backgroundColor = bgcolor;
            break;
        case "noneBox":
            setNone();
            bdSet.style.display = "none";
            clearInterval(timer);
            break;
        case "countDown":
            setNone()
            timedown.style.display = "block";
            break;
        case "time-meter":
            setNone()
            timerBox.style.display = 'block';
            break;
        case "stop":
            isjudge = true;
            timerBox.style.display = 'none';
            clearInterval(timerfun);
            break;
    }
}, false)

//-------------------------倒计时------------------------
inputs.onfocus = function () {
    if (this.value != "") {
        this.value = ""
    }
}
inputs.onblur = function () {
    if (this.value == "") {
        this.value = "请输入倒计时间(单位：分钟):"
    }
}

function addTimer(data, min) {
    let year = parseInt(data.year);
    let seconds = parseInt(data.seconds);//秒
    let sum = parseInt(data.minutes) + min;//分钟
    let hour = parseInt(data.hour);//小时
    let month = parseInt(data.month)//月
    let dayday = parseInt(data.day);//天
    if (sum >= 60) {
        sum = sum - 60;
        hour++;
    }
    if (hour > 24) {
        hour = hour - 24;
        dayday++;
    }
    //简单的认为一个月有30天
    if (dayday > 31) {
        dayday = dayday - 31;
        month++;
    }
    let arr = [year, month, dayday, hour, sum, seconds];
    return arr;
}
function addNode(inputTime, hours, mins, sss) {
    var nowTime = +new Date(); // 返回的是当前时间总的毫秒数
    var times = (inputTime - nowTime) / 1000; // times是剩余时间总的秒数 
    var h = parseInt(times / 60 / 60 % 24); //时
    h = h < 10 ? '0' + h : h;
    hours.innerHTML = h; // 把剩余的小时给 小时黑色盒子
    var m = parseInt(times / 60 % 60); // 分
    m = m < 10 ? '0' + m : m;
    mins.innerHTML = m;
    var s = parseInt(times % 60); // 当前的秒
    s = s < 10 ? '0' + s : s;
    sss.innerHTML = s;
}

timedown.addEventListener("click", function (event) {
    const hours = document.querySelector(".xiaoshi");
    const mins = document.querySelector(".ss");
    const sss = document.querySelector(".sin");
    var number;
    if (event.target.className === 'quren') {
        number = parseInt(inputs.value);
        let arr = addTimer(data, number);
        let numTime = arr[0] + '-' + arr[1] + '-' + arr[2] + ' ' + arr[3] + ':' + arr[4] + ':' + arr[5];
        let inputTime = +new Date(numTime);

        let fun = addNode.bind(null, inputTime, hours, mins, sss);
        fun();
        timer = setInterval(fun, 1000);
    }
    if (event.target.className == "timebutton") {
        number = 0;
        clearInterval(timer)
        timedown.style.display = "none"
        hours.innerHTML = '00';
        mins.innerHTML = "00";
        sss.innerHTML = "00";
        inputs.value = "请输入倒计时间:"
    }
}, false)
// ----------------------计时器------------------------
start.addEventListener('click', function (event) {
    let s = 0,
        m,
        h;
    if (isjudge) {
        starts();
        timerfun = setInterval(starts, 1000)
    }
    function starts() {
        s++;
        if (s > 60) {
            m = m + 1;
            s = 0;
        }
        if (m > 60) {
            h = h + 1;
            m = 0;
        }
        s > 9 ? s : s = "0" + s;
        if (h) {
            h > 9 ? h : h = "0" + h;
            jxiao.innerHTML = h
        }
        if (m) {
            m > 9 ? m : m = "0" + m;
            jminutes.innerHTML = m
        }
        jsen.innerHTML = s
    }

})
